class TestScene extends Scene {
    private timer: egret.Timer;
    private radius: number;
    private monGroup: eui.Group;
    private dayGroup: eui.Group;
    private hourGroup: eui.Group;
    private minGroup: eui.Group;
    private secGroup: eui.Group;
    private dateMap: DateMap;
    private isDrawAllPan: boolean = true;
    private textYear: egret.TextField;
    private unitWidth: number;
    public resourceList: Array<Object> = [{
        type: ''
    }];

    public constructor() {
        super();
        this.addEventListener(Events.ResourceLoadReady, this.created, this);
        this.init('TestSceneSkin', null);
    }

    // public init() {
    //     console.log('#######');
    //     this.addEventListener(Events.ResourceLoadBegin, this.say, this);
    //     setTimeout(() => {
    //         EventDispatcher.getInstance.resourceLoadBegin(this);
    //     }, 5000);
    // }

    // public say() {
    //     egret.log('Hello.');
    // }

    private created(): void {
        const { stageWidth, stageHeight } = this.stage;
        const radius = stageWidth - 120;
        this.radius = radius;
        const y = stageHeight * 0.5;
        // const bg = new egret.Shape();
        // bg.graphics.beginFill(ColorDeepSkyBlue, 0.7);
        // bg.graphics.drawCircle(0, y, radius);
        // bg.graphics.endFill();
        // this.addToBack(bg);

        // const bc = 100
        // const xgroup = new eui.Group();
        // xgroup.x = 100;
        // xgroup.y = 100;
        // xgroup.width = bc;
        // xgroup.height = bc;
        // xgroup.anchorOffsetX = 50;
        // xgroup.anchorOffsetY = 50;
        // this.addToMain(xgroup);

        // const bg = new egret.Shape();
        // bg.graphics.beginFill(ColorDeepSkyBlue, 0.7);
        // bg.graphics.drawRect(0, 0, 100, 100);
        // bg.graphics.endFill();
        // xgroup.addChild(bg);

        // let n = 0;
        // // console.log('@@@@@@@@@');
        // setInterval(() => {
        //     // bg.rotation = n;
        //     egret.Tween.get(xgroup).to({ rotation: n }, 200, egret.Ease.quadIn);
        //     if (n > 180) {
        //         n = n - 360;
        //     }
        //     n += 15;
        // }, 200);

        const r = radius / 8;
        this.unitWidth = r;
        const posY = (stageHeight - 2 * radius) / 2;
        this.monGroup = this.createPanGroup(radius, posY);
        this.dayGroup = this.createPanGroup(radius, posY);
        this.hourGroup = this.createPanGroup(radius, posY);
        this.minGroup = this.createPanGroup(radius, posY);
        this.secGroup = this.createPanGroup(radius, posY);

        this.dateMap = Time.dateMap;
        this.drawLuckPan(y, r);
        this.addToMain(this.monGroup);
        this.addToMain(this.dayGroup);
        this.addToMain(this.hourGroup);
        this.addToMain(this.minGroup);
        this.addToMain(this.secGroup);

        this.syncTime();
        this.timer = new egret.Timer(1000, 0);
        this.timer.addEventListener(egret.TimerEvent.TIMER, this.timerFunc, this);
        this.timer.start();

        drawBackBtn(this.frontLayer, Dispatcher.showMain);
    }

    createPanGroup(radius: number, y: number) {
        const bc = 2 * radius;
        const group = new eui.Group();
        group.x = 0;
        group.y = y + radius;
        group.width = bc;
        group.height = bc;
        group.anchorOffsetX = radius;
        group.anchorOffsetY = radius;
        return group;
    }

    uYear() {
        const { year } = this.dateMap;
        this.textYear.text = year + '年';
    }

    rMon() {
        const { month } = this.dateMap;
        if (month === 1) {
            this.uYear();
        }
        this.tweenRotate(this.monGroup, month * 30, 30);
    }

    redrawDayPan() {
        const { radius, unitWidth } = this;
        this.dayGroup.removeChildren();
        this.drawCircleText(radius, radius, 3 * unitWidth, this.getDays(), this.dayGroup);
    }

    rDay() {
        const { day } = this.dateMap;
        const maxDateNum = Time.monthDays;
        if (day === 1) {
            this.redrawDayPan();
            this.rMon();
        }
        const step = 360 / maxDateNum;
        this.tweenRotate(this.dayGroup, day * step, step);
    }

    rHour() {
        const { hour } = this.dateMap;
        if (hour === 0) {
            this.rDay();
        }
        this.tweenRotate(this.hourGroup, hour * 15, 15);
    }

    rMin() {
        const { minute } = this.dateMap;
        if (minute === 0) {
            this.rHour();
        }
        this.tweenRotate(this.minGroup, minute * 6, 6);
    }

    rSec() {
        this.dateMap = Time.dateMap;
        const { second } = this.dateMap;
        if (second === 0) {
            this.rMin();
        }
        this.tweenRotate(this.secGroup, second * 6, 6);
    }

    tweenRotate(group: eui.Group, angle: number, step: number) {
        if (angle > 180) {
            angle = angle - 360;
        }
        egret.Tween
            .get(group)
            .to({ rotation: angle }, 500, egret.Ease.quadIn)
            .call(() => {
                const v = 180 - angle;
                if (v >= 0 && v < step) {
                    let av = -180;
                    if (v !== 0) {
                        av = step - v - 180;
                    }
                    group.rotation = av;

                }
            });
    }

    syncTime() {
        this.rSec();
        this.rMin();
        this.rHour();
        this.rDay();
        this.rMon();
        this.uYear();
    }

    timerFunc() {
        this.rSec();
    }

    drawLuckPan(y: number, r: number) {
        this.cleanMain();
        this.drawYear(y);
        const { radius } = this;
        this.drawCircleText(radius, radius, 2 * r, this.getMonths(), this.monGroup);
        this.drawCircleText(radius, radius, 3 * r, this.getDays(), this.dayGroup);
        this.drawCircleText(radius, radius, 4 * r, this.getHours(), this.hourGroup);
        this.drawCircleText(radius, radius, 5 * r, this.getMinutes(), this.minGroup);
        this.drawCircleText(radius, radius, 6 * r, this.getSeconds(), this.secGroup);
    }

    drawYear(y: number) {
        const tYear: egret.TextField = new egret.TextField();
        this.textYear = tYear;
        tYear.text = this.dateMap.year + '年';
        tYear.fontFamily = '"隶书"';
        tYear.size = 18;
        tYear.y = y;
        tYear.textColor = ColorWhite;
        tYear.stroke = 0;
        tYear.bold = true;
        tYear.textAlign = egret.HorizontalAlign.CENTER;
        tYear.verticalAlign = egret.VerticalAlign.BOTTOM;
        this.addToMain(tYear);
    }

    getMonths() {
        const ymNum = 12;
        const months = [];
        for (let i = 0; i < ymNum; i++) {
            const str = CnNum.NumToHz(i) + '月';
            months.push(str);
        }
        return months;
    }

    getDays() {
        const monDays = Time.monthDays;
        const days = [];
        for (let i = 0; i < monDays; i++) {
            const str = CnNum.NumToHz(i) + '日';
            days.push(str);
        }
        return days;
    }

    getHours() {
        const hours = [];
        const dayHours = 24;
        for (let i = 0; i < dayHours; i++) {
            const str = CnNum.NumToHz(i !== 24 ? i : 0) + '点';
            hours.push(str);
        }
        return hours;
    }

    getMinutes() {
        const minutes = [];
        const hourMinutes = 60;
        for (let i = 0; i < hourMinutes; i++) {
            const str = CnNum.NumToHz(i !== 60 ? i : 0) + '分';
            minutes.push(str);
        }
        return minutes;
    }

    getSeconds() {
        const seconds = [];
        const minuteSeconds = 60;
        for (let i = 0; i < minuteSeconds; i++) {
            const str = CnNum.NumToHz(i !== 60 ? i : 0) + '秒';
            seconds.push(str);
        }
        return seconds;
    }

    drawCircleText(x: number, y: number, radius: number, arr: Array<string>, group: eui.Group): void {
        const len = arr.length;
        let i = 0;
        for (const str of arr) {
            const tf: egret.TextField = new egret.TextField();
            tf.text = arr[i];
            tf.fontFamily = '"隶书"';
            tf.size = 14;
            const angle = -(360 / len) * i;
            tf.rotation = angle;
            tf.width = radius;
            tf.x = x;
            tf.y = y;
            tf.textColor = ColorWhite;
            tf.stroke = 0;
            tf.bold = false;
            tf.textAlign = egret.HorizontalAlign.RIGHT;
            tf.verticalAlign = egret.VerticalAlign.BOTTOM;
            group.addChild(tf);
            i++;
        }
    }
}
